<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="lib/vue.js"></script>
</head>
<body>
<div id="app">
{{total}}
</div>
<script>
    var app = new Vue({
        el:'#app',
        data:{
            list:[
                {id:11,name:'张三','zh':80,en:90},
                {id:11,name:'李四','zh':85,en:96},
                {id:11,name:'王五','zh':89,en:98},
                {id:11,name:'刘思','zh':86,en:96},
                {id:11,name:'李亮','zh':87,en:95}
            ]
        },
        computed:{
            total: function () {
                let listLenth=this.list.length
                let zhtotal=0
                let entotal=0
                // for (let i=0;i<this.list.length;i++){
                //     zhtotal+=this.list[i].zh
                //     entotal+=this.list[i].en
                // }
              for(let i of this.list){
                zhtotal+=i.zh
                entotal+=i.en
              }
                // return '语文总成绩为：'+zhtotal+'英语总成绩为：'+entotal
                return '语文平均成绩为：'+zhtotal/listLenth+'英语平均成绩为：'+entotal/listLenth
            }
        }
    })
</script>
</body>
</html>
